<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcss.com/angular.js/1.7.8/angular.js"></script>
</head>
<body>
<h1>快递费用计算，1公斤10元</h1>
<div ng-app="kai" ng-controller="cantor"><!--必须要设置ng-app ，否则不起作用，会直接显示{{kg*10}}表达式，而不是数值。-->
    <p><input type="text" name="kg" ng-model="kg">公斤</p>
    <p><span>{{price()}}</span>元</p>
</div>
</body>
<script>
    const app = angular.module("kai", []);

    app.controller('cantor',function($scope){
        $scope.kg = 1;
        $scope.price = function () {
            if($scope.kg <=1){
                return 15;
            }else{
                return ($scope.kg -1)*10 +20;
            }
        }

    });


</script>
</html>
